<template>
	<view class="page">

		<!-- 标题区 -->
		<view class="title-wrap">
			<text class="title">建筑饰面损伤智能诊断系统</text>
		</view>

		<!-- 功能按钮区 -->
		<view class="btn-group">
			<button class="btn btn-blue" @click="takePhoto">
				<text class="icon">📸</text>
				<text class="text">拍照检测</text>
			</button>
			<button class="btn btn-green" @click="selectImage">
				<text class="icon">📂</text>
				<text class="text">打开相册</text>
			</button>
			<button class="btn btn-purple" @click="historical_records">
				<text class="icon">📖</text>
				<text class="text">查看历史</text>
			</button>
		</view>
	</view>
</template>
<script setup>
	import {
		ref
	} from 'vue'
	const imagePath = ref('')

	function historical_records() {
		uni.navigateTo({
			url:'/pages/historical_records/historical_records'
		})
	}
	
	function handleImageSelection(sourceType){
		uni.chooseImage({
			count:1,
			sourceType:[sourceType],
			success:(res)=>{
				imagePath.value = res.tempFilePaths[0];
				uni.navigateTo({
					url:`/pages/Testing/Testing?${sourceType} `
				})
			},
			fail:(err)=>{
				uni.showToast({
					title:sourceType === 'camera'? '拍照失败':'选择图片失败',
					icon:'none'
				});
			}
		})
	}
	function takePhoto() {
		handleImageSelection('camera');
	}

	function selectImage() {
		handleImageSelection('album');
	}
</script>
<style lang="scss" scoped>
	@import "@/common/css/index.scss";
</style>